<template>
	<view v-if="isFlag">
		<view>
			<table-title v-if="status !== 4" content="企业认证及资料审核"></table-title>
			<table-title v-if="status == 4" content="企业展示"></table-title>
			<!-- <view class="record-id">单号：{{processNo}}</view> -->
			<view v-if="type !== '游客'">
				<view v-if="status !== 4" class="in-center">
					<small-title content="所在位置"></small-title>
					<view class="state-bar">
						<view class="state-msg">{{state}}</view>
					</view>
				</view>
				<view v-if="status !== 4" class="item-table">
					<view-item name="楼盘" :value="userMsg.userBuilding"></view-item>
					<view-item name="楼层" :value="userMsg.userFloor"></view-item>
					<view-item name="房号" :value="userMsg.userRoom" :isLast="true"></view-item>
				</view>
			</view>
			<small-title content="公司基本资料"></small-title>
			<view v-if="isReady" style="margin-left: 80rpx;margin-right: 50rpx;">
				<uni-forms :modelValue="companyBaseInfo">
					<uni-forms-item label="公司简称" name="name">
						<uni-easyinput :disabled="status != -1" name="name" style="background-color: #ffffff;" type="text" v-model="companyBaseInfo.name" />
					</uni-forms-item>
					<uni-forms-item label="公司全称" name="allName">
						<uni-easyinput :disabled="status != -1" name="allName" style="background-color: #ffffff;" type="text" v-model="companyBaseInfo.allName" />
					</uni-forms-item>
					<view v-if="type == '游客'">
						<uni-forms-item label="所在城市" name="areaId">
							<picker :disabled="status != -1" @change="bindPickerChangeArea" :value="index" :range="cityName">
								<uni-easyinput :disabled="true" name="cityName" style="background-color: #ffffff;" type="text" v-model="areaName" />
							</picker>
						</uni-forms-item>
					</view>
					<uni-forms-item label="所在行业" name="industry">
						<picker :disabled="status != -1" @change="bindPickerChange" :value="index" :range="industryList">
							<uni-easyinput :disabled="true" name="industry" style="background-color: #ffffff;" type="text" v-model="companyBaseInfo.industry" />
						</picker>
					</uni-forms-item>
					<uni-forms-item label="人员规模" name="scale">
						<picker :disabled="status != -1" @change="bindPickerChangeScale" :value="index" :range="scaleList">
							<uni-easyinput :disabled="true" name="scale" style="background-color: #ffffff;" type="text" v-model="companyBaseInfo.scale" />
						</picker>
					</uni-forms-item>
					<uni-forms-item label="融资阶段" name="financingStage">
						<picker :disabled="status != -1" @change="bindPickerChangefinancingStage" :value="index" :range="financingStageList">
							<uni-easyinput :disabled="true" name="financingStage" style="background-color: #ffffff;" type="text" v-model="companyBaseInfo.financingStage" />
						</picker>
					</uni-forms-item>
					<uni-forms-item v-if="status !== 4" label="信用代码" name="creditCode">
						<uni-easyinput :disabled="status != -1" name="creditCode" style="background-color: #ffffff;" type="text" v-model="companyBaseInfo.creditCode" />
					</uni-forms-item>
					<uni-forms-item v-if="status !== 4" label="营业执照" name="businessLicense">
						<!-- <uni-easyinput :disabled="true" name="name" style="background-color: #ffffff;" type="text" v-model="companyBaseInfo.creditCode" /> -->
						<image v-if="processFlag" :class="businessLicense=='/static/uploadImg.png' ? 'pay-image' : 'pay-image-border'" :src="businessLicense" mode="scaleToFill" @tap='chooseImage(0)'></image>
					</uni-forms-item>
					<uni-forms-item label="公司logo" name="displayLogo">
						<image v-if="processFlag" :class="displayLogo=='/static/uploadImg.png' ? 'pay-image' : 'pay-image-border'" :src="displayLogo" mode="scaleToFill" @tap='chooseImage(1)'></image>
					</uni-forms-item>
				</uni-forms>
			</view>
			<view v-if="((status != -1) && (status != 5) && (status != 0)) || type == '游客'">
				<small-title content="展示必备资料"></small-title>
				<view style="margin-left: 80rpx;margin-right: 50rpx;">
					<uni-forms :modelValue="companyExtraInfo">
						<uni-forms-item label="公司介绍" name="desc">
							<uni-easyinput name="desc" style="background-color: #ffffff;" type="textarea" v-model="companyExtraInfo.desc" :disabled="!(status == 1 || type == '游客')" />
						</uni-forms-item>
						<uni-forms-item label="上班时间" name="workTime">
							<uni-easyinput name="workTime" style="background-color: #ffffff;" type="text" v-model="companyExtraInfo.workTime" :disabled="!(status == 1 || type == '游客')" />
						</uni-forms-item>
						<uni-forms-item label="联系电话" name="phone">
							<uni-easyinput name="phone" style="background-color: #ffffff;" type="number" v-model="companyExtraInfo.phone" :disabled="!(status == 1 || type == '游客')" />
						</uni-forms-item>
						<uni-forms-item label="公司相册" name="photo">
							<uni-file-picker 
							    v-model="photoValue" 
							    fileMediatype="image" 
							    mode="grid" 
								:auto-upload="false"
								:readonly="!(status == 1 || type == '游客')"
							    @select="select" 
								@delete="removePhoto"
							    @progress="progress" 
							    @success="success" 
							    @fail="fail" 
							/>
						</uni-forms-item>
<!-- 						<uni-forms-item label="公司视频" name="bank">
							<uni-easyinput name="bank" style="background-color: #ffffff;" type="text" v-model="companyExtraInfo.video" :disabled="status != 1" />
						</uni-forms-item> -->
						<uni-forms-item label="其他" name="need">
							<uni-easyinput name="need" style="background-color: #ffffff;" type="textarea" v-model="companyExtraInfo.need" :disabled="!(status == 1 || type == '游客')" />
						</uni-forms-item>
					</uni-forms>
				</view>
			</view>

<!-- 			<small-title content="处理进度"></small-title>
			<proccess-bar v-if="processFlag" :proccessList="proccessListDefult"></proccess-bar> -->
			<view v-if="status===-1" class="mix-button">
				<view class="left-part">
					<button v-if="type !== '游客'" class="left-button" @click="addOrder" >提交认证</button>
					<button v-if="type == '游客'" class="left-button" @click="addOrderAll" >提交认证</button>
				</view>
				<view class="right-part">
					<button class="right-button" @click="back">返回</button>
				</view>
			</view>
			<view v-if="status===1" class="mix-button">
				<view class="left-part">
					<button class="left-button" @click="qfConfirm" >提交资料审核</button>
				</view>
				<view class="right-part">
					<button class="right-button" @click="back">返回</button>
				</view>
			</view>
			<view v-if="status===4" class="mix-button">
				<view class="left-part">
					<button v-if="isCollected" class="left-button" @click="collected" >取消收藏</button>
					<button v-if="!isCollected" class="left-button" @click="collected" >收藏</button>
				</view>
				<view class="right-part">
					<button class="right-button" @click="open">举报</button>
				</view>
			</view>
			<view style="height: 200rpx;"></view>
		</view>
		<uni-popup ref="popup" type="dialog">
		    <uni-popup-dialog mode="input" message="成功消息" title="举报内容" :duration="2000" :before-close="true" @close="close" @confirm="confirm"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>		

<script>
	import {
		ONLINE_SERVER_ADDRESS_BASE,
		syncGetOrder,
		syncPriceInfo,
		myUploadFile,
	} from "../../../util/network.js"
	import {
		processHistoryList
	} from "../../../util/common.js"
	export default{
		data() {
			return {
				orderInfo:'',
				taxInfo:'',
				invoiceType:'',
				processFlag:false,
				token:'',
				recordId: '待分配',                                                         //单号
				processNo:'待分配',
				state: '',																	   //状态
				status: -1,
				userMsg:{'userName':'','userPhone':'','userCompany':'','userBuilding':'',
					'userFloor':'','userRoom':''},                                                          //支付方式
				companyBaseInfo:{'name':'','allName':'','industry':'','scale':'',
					'financingStage':'','creditCode':'','businessLicense':'','displayLogo':''},
				businessLicense:'/static/uploadImg.png',
				displayLogo:'/static/uploadImg.png',
				companyExtraInfo:{'desc':'','photo':[],'video':'','workTime':'',
					'phone':'','need':''},
				industryId:-1,
				areaId:-1,
				areaName:'',
				proccessList:[
					{'type':'firstCanvas','commentMsg':'发起申请','time':'2021-01-01 01:01:11'},
					{'type':'middleCanvas','commentMsg':'受理','time':'2020-02-02 02:02:22'},
					{'type':'lastCanvas','commentMsg':'办结','time':'2020-03-03 03:33:33'}
				],                                                                                 
				proccessListDefult:[],                                                             
				industryList:[],
				industryListId:[],
				scaleList:['0-99人','100-500人','500-999人','1000+人'],
				financingStageList:['未融资','A轮','B轮','C轮','D轮','E轮','F轮','已上市'],
				index:0,
				previewUrl:`${ONLINE_SERVER_ADDRESS_BASE}/file/thumbnail-preview/`,
				photoValue:[],
				imageTemps:[],
				isCollected:false,
				comment:'',
				isReady:false,
				allCity:[],
				cityName:[],
				cityId:[],
				type:'',
				isFlag:false,
			}
		},
		methods: {
			open() {
				this.$refs.popup.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup.close()
			},
			/**
			 * 点击确认按钮触发
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm(value) {
				this.$refs.popup.close()
				if(value == ""){
					uni.showModal({
						content:'评价不能为空',
						showCancel:false
					});
					this.$refs.popup.close()
				}else{
					this.comment = "举报内容：" + value
					this.reported()
					// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
					// ...
					this.$refs.popup.close()
				}
			},
			bindPickerChangeArea: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
				this.areaId = this.cityId[this.index]
				this.areaName = this.cityName[this.index]
			},
			bindPickerChange: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
				this.industryId = this.industryListId[this.index]
				console.log(this.industryId)
				this.companyBaseInfo.industry = this.industryList[this.index]
			},
			bindPickerChangeScale: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
				this.companyBaseInfo.scale = this.scaleList[this.index]
			},
			bindPickerChangefinancingStage: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
				this.companyBaseInfo.financingStage = this.financingStageList[this.index]
			},
			select(e){
				console.log('选择文件：',e)
				console.log('当前文件：',this.photoValue)
				e.tempFiles.forEach(item => {
					let a = myUploadFile(this.token, item.path)
					 a.then((v)=>{
						 let temp = {}
						 temp.url = item.url
						 temp.id = v
						 this.imageTemps.push(temp)
						 console.log(this.imageTemps)
					})
				})
				// let a = myUploadFile(this.token, e.tempFilePaths[0])
				//  a.then((v)=>{
				// 	 this.companyExtraInfo.photo.push(v)
				// })
			},
			removePhoto(e){
				for (var i = 0; i < this.imageTemps.length; i++) {
					if(this.imageTemps[i].url == e.tempFile.url){
						this.imageTemps.splice(i, 1)
						break;
					}
				}
			},
			chooseImage(type){
				if(this.status === -1 || this.status=== 5) {
					uni.chooseImage({
						count: 1,
						sourceType: ['album', 'camera'],
						// #ifdef MP-WEIXIN
						sizeType: ['compressed'],
						// #endif
						success: (res) => {
							console.log(res)
							let a = myUploadFile(this.token, res.tempFilePaths[0])
							 a.then((v)=>{
								 if(type == 0){
									 this.companyBaseInfo.businessLicense = v
									 this.businessLicense = this.previewUrl + v
								 }else {
									 this.companyBaseInfo.displayLogo = v
									 this.displayLogo = this.previewUrl + v
								 }
							})
						}
					})
				}else{
					let temp = ''
					if(type == 0){
						temp = this.previewUrl + this.companyBaseInfo.businessLicense
					}else {
						temp = this.previewUrl + this.companyBaseInfo.displayLogo
					}
					uni.previewImage({
						current: 0,
						urls: [temp]
					})
				}
			},
			addOrder(){
				if(this.checkPara() == -1){
					return -1
				}
				console.log("[info]","工单已创建，工单号为：" + this.recordId)
				let companyBaseInfoStr = JSON.stringify(this.companyBaseInfo)
				this.industryId = parseInt(this.industryId)
				console.log(this.industryId,companyBaseInfoStr)
				uni.request({
					url:`${ONLINE_SERVER_ADDRESS_BASE}/company-certification/add`,
					header: {
						'Authorization': this.token,
					},
					data: {
						companyBaseInfo:companyBaseInfoStr,
						industryId:this.industryId,
						commentMsg: '用户提交企业认证申请'                       //操作信息
					},
					method:'POST',
					success: function (res) {
						console.log(res)
						if(res.data.code == 200){
							uni.navigateBack()
						}
					}
				})
			},
			addOrderAll(){
				if(this.areaId == null || this.areaId == -1){
					uni.showModal({
						content:'请选择所在城市',
						showCancel:false
					})
					return -1
				}
				this.companyExtraInfo.photo = []
				for (var i = 0; i < this.imageTemps.length; i++) {
					this.companyExtraInfo.photo.push(this.imageTemps[i].id)
				}
				if(this.checkPara() == -1){
					return -1
				}
				if(this.checkPara1() == -1){
					return -1
				}
				console.log("[info]","工单已创建，工单号为：" + this.recordId)
				let companyBaseInfoStr = JSON.stringify(this.companyBaseInfo)
				let extraInfoStr = JSON.stringify(this.companyExtraInfo)
				this.industryId = parseInt(this.industryId)
				this.areaId = parseInt(this.areaId)
				console.log(this.industryId,companyBaseInfoStr)
				uni.request({
					url:`${ONLINE_SERVER_ADDRESS_BASE}/company-certification/add-all`,
					header: {
						'Authorization': this.token,
					},
					data: {
						companyBaseInfo:companyBaseInfoStr,
						extraInfo:extraInfoStr,
						industryId:this.industryId,
						areaId:this.areaId,
						areaName:this.areaName,
						commentMsg: '游客提交企业认证申请'                       //操作信息
					},
					method:'POST',
					success: function (res) {
						console.log(res)
						if(res.data.code == 200){
							uni.navigateBack()
						}
					}
				})
			},
			qfConfirm(){
				this.companyExtraInfo.photo = []
				for (var i = 0; i < this.imageTemps.length; i++) {
					this.companyExtraInfo.photo.push(this.imageTemps[i].id)
				}
				if(this.checkPara1() == -1){
					return -1
				}
				console.log("[info]","工单已创建，工单号为：" + this.recordId)
				let extraInfoStr = JSON.stringify(this.companyExtraInfo)
				console.log(extraInfoStr)
				uni.request({
					url:`${ONLINE_SERVER_ADDRESS_BASE}/company-certification/qf-confirm/` + this.recordId,
					header: {
						'Authorization': this.token,
					},
					data: {
						extraInfo:extraInfoStr,
						commentMsg: '用户提交展示资料审核申请'                       //操作信息
					},
					method:'POST',
					success: function (res) {
						console.log(res)
						if(res.data.code == 200){
							uni.navigateBack()
						}
					}
				})
			},
			reported(){

				uni.request({
					url:`${ONLINE_SERVER_ADDRESS_BASE}/company-certification/reported/` + this.recordId,
					header: {
						'Authorization': this.token,
					},
					data: {
						content:this.comment,
					},
					method:'POST',
					success: function (res) {
						console.log(res)
						if(res.data.code == 200){
							uni.navigateBack()
						}
						if(res.data.code == 1000){
							uni.showModal({
								content:'请先登录！',
								showCancel:false
							});
						}
					}
				})
			},
			collected(){
				// if(this.checkPara() == -1){
				// 	return -1
				// }
				let _this = this
				console.log("[info]","工单已创建，工单号为：" + this.recordId)
				uni.request({
					url:`${ONLINE_SERVER_ADDRESS_BASE}/company-certification/collected/` + this.recordId,
					header: {
						'Authorization': this.token,
					},
					method:'POST',
					success: function (res) {
						console.log(res)
						if(res.data.code == 200){
							_this.isCollected = !_this.isCollected
						}
						if(res.data.code == 1000){
							uni.showModal({
								content:'请先登录！',
								showCancel:false
							});
						}
					}
				})
			},
			checkPara(){
				try{
					this.companyBaseInfo.name = this.companyBaseInfo.name.trim()
					this.companyBaseInfo.allName = this.companyBaseInfo.allName.trim()
					this.companyBaseInfo.creditCode = this.companyBaseInfo.creditCode.trim()
				}catch(e){
					//TODO handle the exception
				}
				if(this.companyBaseInfo.name == null || this.companyBaseInfo.name == ""){
					uni.showModal({
						content:'公司简称不能为空',
						showCancel:false
					})
					return -1
				}
				if(this.companyBaseInfo.allName == null || this.companyBaseInfo.allName == ""){
					uni.showModal({
						content:'公司全称不能为空',
						showCancel:false
					})
					return -1
				}
				if(this.companyBaseInfo.creditCode == null || this.companyBaseInfo.creditCode == ""){
					uni.showModal({
						content:'公司信用代码不能为空',
						showCancel:false
					})
					return -1
				}
				if(this.companyBaseInfo.businessLicense == ""){
					uni.showModal({
						content:'请上传营业执照',
						showCancel:false
					})
					return -1
				}
				if(this.companyBaseInfo.displayLogo == ""){
					uni.showModal({
						content:'请上传公司logo',
						showCancel:false
					})
					return -1
				}
			},
			
			checkPara1(){
				try{
					this.companyExtraInfo.desc = this.companyExtraInfo.desc.trim()
					this.companyExtraInfo.workTime = this.companyExtraInfo.workTime.trim()
					this.companyExtraInfo.phone = this.companyExtraInfo.phone.trim()
				}catch(e){
					//TODO handle the exception
				}
				if(this.companyExtraInfo.desc == null || this.companyExtraInfo.desc == ""){
					uni.showModal({
						content:'公司介绍不能为空',
						showCancel:false
					})
					return -1
				}
				if(this.companyExtraInfo.workTime == null || this.companyExtraInfo.workTime == ""){
					uni.showModal({
						content:'公司工作时间不能为空',
						showCancel:false
					})
					return -1
				}
				if(this.companyExtraInfo.phone == null || this.companyExtraInfo.phone == ""){
					uni.showModal({
						content:'公司联系方式不能为空',
						showCancel:false
					})
					return -1
				}
			},
			getOrder(){
				let a = syncGetOrder("company-certification/show/" + this.recordId)
				 a.then((res)=>{
					 console.log("异步",res)
					 if(res.data.code == 200){
						 this.companyBaseInfo =JSON.parse(res.data.data.companyBaseInfo)
						 this.status = parseInt(res.data.data.status)
						 if(this.status > 1){
							 try{
								this.companyExtraInfo = JSON.parse(res.data.data.extraInfo)
								console.log("this.extraInfo",this.companyExtraInfo)
								this.imageTemps = []
								this.photoValue = []
								this.companyExtraInfo.photo.forEach(item => {
									let temp = {}
									temp.url = this.previewUrl + item
									temp.id = parseInt(item)
									this.imageTemps.push(temp)
									this.photoValue.push(temp)
								})
							 }catch(e){
								//TODO handle the exception
							 }
						 }
						 this.businessLicense = this.previewUrl + this.companyBaseInfo.businessLicense
						 this.displayLogo = this.previewUrl + this.companyBaseInfo.displayLogo
						 // this.$forceUpdate()
						 switch(this.status) {
							 case 0:
								this.state = "待审核企业"
								break;
							 case 1:
								this.state = "待提交审核"
								break;
							 case 2:
								this.state = "待审核资料"
								break;
							 case 3:
								this.state = "下架中"
								break;
							 case 4:
								this.state = "展示中"
								break;
							 case 5:
								this.state = "认证已驳回"
								break;
							 case 6:
								this.state = "已删除"
								break;
							 default:
								this.state = "未定义状态"
						 } 
						 this.isCollected = res.data.data.hasCollected
						 // this.processNo = res.data.data.processNo
						 // this.proccessListDefult = processHistoryList(res.data.data.processDetail)						
						 this.isFlag = true
						 this.isReady = true
						 this.processFlag = true
					}
				})
			},
			back(){
				uni.navigateBack()
			},
			getIndustryList(){
				let _this = this
				uni.request({
					url:`${ONLINE_SERVER_ADDRESS_BASE}/industry/list`,
					data: {
						pageNo:0,//操作信息
						pageSize:100,
					},
					method:'GET',
					success: function (res) {
						console.log('行业',res)
						if(res.data.code == 200){
							_this.industryList = []
							_this.industryListId = []
							res.data.data.industryList.forEach(item => {
								if(item.status == 0){
									let temp = item.industryName + '|' + item.id
									_this.industryList.push(item.industryName)
									_this.industryListId.push(item.id)
								}
							})
							try{
								_this.industryId = _this.industryListId[0]
								_this.companyBaseInfo.industry = _this.industryList[0]
							}catch(e){
								//TODO handle the exception
							}
							_this.companyBaseInfo.scale = _this.scaleList[0]
							_this.companyBaseInfo.financingStage = _this.financingStageList[0]
						}
					},
					fail: (res) => {
						console.log("获取行业失败")
					}
				})
			}
		},
		onLoad(option) {
			//传入单号
			let userInfo = uni.getStorageSync('userinfo')
			if(userInfo != null){
				this.userMsg.userBuilding = userInfo.title
				this.userMsg.userFloor = userInfo.floor
				this.userMsg.userRoom = userInfo.houseNumber
				this.recordId = option.id
				this.type = option.type
				if(this.type == "游客"){
					this.allCity = JSON.parse(option.allCity)
					this.allCity.forEach(item => {
						this.cityName.push(item.name)
						this.cityId.push(item.value)
					})
				}
				this.state = option.state
				this.token = uni.getStorageSync('token')
				this.getIndustryList()
				console.log(userInfo)
			}else{
				uni.navigateTo('../../login/login')
			}
		},
		mounted() {
			//如果是新建表单则不查询
			if(this.state != '待申请'){
				this.getOrder()
			}else{
				this.isFlag = true
				this.processFlag = true
				this.isReady = true
			}
		}
	}
</script>

<style>
	page{
		background-color: #ffffff
	}
	.record-id{
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 30rpx;
	}
	.state-bar{
		display: flex;
		align-items: center;
		color: #FFFFFF;
		background-color: #DD524D;
		width: 260rpx;
		justify-content: center;
		margin-left: auto;
		margin-right: 50rpx;
		font-size: 30rpx;
		border-radius: 50rpx;
		height: 50rpx;
	}
	.state-msg{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.item-table{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.mix-button{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.left-part{
		float: right;
	}
	.right-part{
		float: left;
	}
	.left-button{
		background-color: #FF0000;
		border-radius: 50rpx 0 0 50rpx;
		color: #FFFFFF;
		width: 300rpx;
		font-size: 30rpx;
	}
	.right-button{
		background-color: #0000FF;
		border-radius: 0 50rpx 50rpx 0;
		color: #FFFFFF;
		width: 300rpx;
		font-size: 30rpx;
	}
	.in-center{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.add-button {
		border-width: 0px;
		align-items: center;
		justify-content: center;
		margin: 30rpx 0 40rpx 250rpx;
		height: 50rpx;
		width: 250rpx;
		display: flex;
		color: #22B242;
	}
	.payway-style {
		display: flex;
		flex-direction: column;
		width: 650rpx;
	}
	.first-radio {
		height: 100rpx;
		display: flex;
		align-items: center;
		background-color: #FFFFFF;
		padding-left: 25rpx;
		border: solid 0rpx #C8C7CC;
		border-bottom: none;
		border-right: none;
	}
	.second-radio {
		height: 100rpx;
		display: flex;
		align-items: center;
		background-color: #FFFFFF;
		padding-left: 25rpx;
		border: solid 0rpx #C8C7CC;
		border-right: none;
		width: 50rpx;
	}
	.payway-choice {
		display: flex;
		align-items: center;
		background-color: #FFFFFF;
		border: solid 0rpx #C8C7CC;
		width: 600rpx;
		border-left: none;
	}
	.payway-logo {
		width: 50rpx;
		height: 50rpx;
		margin: 0 25rpx 0 25rpx;
	}
	.textarea-style{
		display: flex;
		justify-content: center;
		width: 650rpx;
		height: 200rpx;
		margin-left: 50rpx;
		background-color: #FFFFFF;
		border: solid 1rpx #C0C0C0;
	}
	.small-title{
		margin: 20rpx 0 20rpx 50rpx;
	}
	.pay-image{
		margin: 20rpx 0 20rpx 0rpx;
		width: 147rpx;
		height: 147rpx;
	}
	.pay-image-border{
		border:2rpx solid;
		border-radius: 2px;
		margin: 20rpx 0 20rpx 0rpx;
		width: 143rpx;
		height: 143rpx;
	}
</style>
